<script setup>
import { getOverduePurchase } from '@/api/visual/index.js'
import { formatMoney } from '@/utils/globalMethod'
import moment from 'moment'
const key = ref(1)
const config = reactive({
  header: [
    '采购单号',
    '厂商代号',
    '序号',
    '品号',
    '名称',
    '规格',
    '数量',
    '已交量',
    '未交数',
    '现库存',
    '预交日',
    '逾期天数'
  ],
  data: [],
  index: false,
  headerBGC: 'rgba(0,0,0,0)',
  oddRowBGC: 'rgba(0,0,0,0)',
  evenRowBGC: 'rgba(0,0,0,0)',
  align: [
    'center',
    'center',
    'center',
    'center',
    'center',
    'center',
    'center',
    'center',
    'center',
    'center',
    'center',
    'center'
  ],
  // columnWidth: [120],
  rowNum: 10
})

const loadData = async () => {
  const { data } = await getOverduePurchase()
  config.data = data.map(item => [
    item.BillNO,
    item.CustomerID,
    item.SerNO,
    item.ProdID,
    item.ProdName,
    item.ProdSize,
    (item.Quantity = formatMoney(null, item.Quantity)),
    (item.yjsl = formatMoney(null, item.yjsl)),
    (item.wjsl = formatMoney(null, item.wjsl)),
    (item.xyzsl = formatMoney(null, item.xyzsl)),
    (item.yjr = item.yjr > 0 ? moment(`${item.yjr}`).format('YYYY-MM-DD') : ''),
    item.cqts
  ])
}

const keyResize = () => {
  nextTick(() => {
    setTimeout(() => {
      key.value++
    }, 100)
  })
}

onMounted(async () => {
  await loadData()
})

onMounted(() => {
  window.addEventListener('resize', keyResize)
})

onUnmounted(() => {
  window.removeEventListener('resize', keyResize)
})
</script>

<template>
  <ps-borderbox5 class="ps_w_h_100">
    <dv-scroll-board :config="config" :key="key" />
  </ps-borderbox5>
</template>

<style scoped lang="scss">
.purchaseBoard5 {
  box-sizing: border-box;
}
</style>
